<template>
  <div id="officialList">
    <h1 class="con-right-title">
      官方征集自评活动
    </h1>
    <div class="bottom-box">
      <!--table-->
      <div class="table">
        <!--上部搜索条件-->
        <topSearch :form-inline="formInline"></topSearch>
        <!-- 操作按钮 -->
        <div class="table-conBtn">
          <el-button type="warning" icon="el-icon-plus" @click="createHandle">
            创建活动
          </el-button>
          <!-- <el-button type="warning" icon="el-icon-edit" @click="editRoles" :disabled="editdisabled">修改</el-button> -->
          <!-- <el-button type="warning" @click="delRoles" :disabled="deldisabled" plain>批量删除</el-button>
          <el-button type="warning" icon="el-icon-download" @click="exportRoles">导出</el-button> -->
        </div>
        <!--下部table-->
        <el-table :data="tableData" style="width: 100%">
          <el-table-column type="index" width="60" align="center" label="序号">
            <template slot-scope="scope">
              {{ scope.$index | filterPage(searchParams.pageNum, searchParams.pageSize) }}
            </template>
          </el-table-column>
          <el-table-column prop="id" label="活动ID" width="150" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="changeView('managementDetail')">
                {{ scope.row.id }}
              </el-button>
            </template>
          </el-table-column>
          <el-table-column
            prop="questionnaireType"
            label="活动展示名称"
            align="center"
            min-width="150"
          ></el-table-column>
          <el-table-column
            prop="questionnaireName"
            label="题目数量"
            align="center"
            min-width="200"
          ></el-table-column>
          <el-table-column
            prop="firstStatus"
            label="审核状态"
            min-width="100"
            align="center"
          >
            <template slot-scope="scope">
              <span v-if="scope.row.firstStatus === 1" class="tag-span default"
                >未审核</span
              >
              <span
                v-else-if="scope.row.firstStatus === 2"
                class="tag-span primary"
                >已通过</span
              >
              <span
                v-else-if="scope.row.firstStatus === -1"
                class="tag-span warning"
                >未通过</span
              >
            </template>
          </el-table-column>
          <el-table-column
            prop="secondStatus"
            label="提交状态"
            align="center"
            min-width="100"
          >
            <template slot-scope="scope">
              <span v-if="scope.row.secondStatus === 1" style="color: #1dc8a4"
                >已提交</span
              >
              <span v-else style="color: #000">未提交</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="createTime"
            label="创建时间"
            align="center"
            min-width="150"
          ></el-table-column>
          <el-table-column
            prop="publishPerson"
            label="创建人"
            align="center"
          ></el-table-column>
          <el-table-column
            label="操作"
            prop="secondStatus"
            width="180"
            align="center"
          >
            <template slot-scope="scope">
              <div
                v-if="
                  scope.row.firstStatus === 1 && scope.row.secondStatus === 1
                "
              >
                <el-button type="text" @click="handelsubmit(scope.row)">
                  提交
                </el-button>
                <el-button type="text" @click="createHandle">
                  编辑
                </el-button>
                <el-button type="text" @click="handeldelete()">
                  删除
                </el-button>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>
import topSearch from '@component/behaviorManagement/eventManagement/official/topSearch' // 上部搜索条件
// import dialogAddEdit from '@component/behaviorManagement/eventManagement/official/dialogAddEdit' //新增/编辑
export default {
  name: 'ManagementList',
  msg: '活动管理-列表页',
  components: {
    topSearch
  },
  data() {
    return {
      // loading: true,
      formInline: {
        // 搜索条件
        firstStatus: 0, // 一审状态,默认全部
        secondStatus: 0, // 二审状态,默认全部
        questionnaireType: 0, // 活动类型,默认全部
        questionnaireNumber: 0, // 活动编号
        date: '' // 选择的时间
      },
      searchParams: {
        pageNum: 1, // 当前页数
        pageSize: 10 // 页面显示条数
      },
      // table内容
      tableData: [
        {
          id: 'HD001', // 活动编号
          questionnaireType: '官方征集自评活动', // 活动类型
          questionnaireName: '设计师优秀作品评选活动', // 活动名称
          questionnaireSort: 1, // 活动排序
          questionnaireTime: '2019-08-04 12:20:20-2019-08-05 12:20:20', // 活动时间
          firstStatus: 1, // 一审状态 1未审核 2已通过 -1未通过
          secondStatus: 1, // 二审状态 1未审核 2已通过 -1未通过
          createTime: '2019-08-05 12:20:20', // 创建时间
          publishPerson: '王玉龙' // 发布者
        },
        {
          id: 'HD001', // 活动编号
          questionnaireType: '官方征集自评活动', // 活动类型
          questionnaireName: '设计师优秀作品评选活动', // 活动名称
          questionnaireSort: 1, // 活动排序
          questionnaireTime: '2019-08-04 12:20:20-2019-08-05 12:20:20', // 活动时间
          firstStatus: 2, // 一审状态 1未审核 2已通过 -1未通过
          secondStatus: 2, // 二审状态 1未审核 2已通过 -1未通过
          createTime: '2019-08-05 12:20:20', // 创建时间
          publishPerson: '王玉龙' // 发布者
        },
        {
          id: 'HD001', // 活动编号
          questionnaireType: '官方征集自评活动', // 活动类型
          questionnaireName: '设计师优秀作品评选活动', // 活动名称
          questionnaireSort: 1, // 活动排序
          questionnaireTime: '2019-08-04 12:20:20-2019-08-05 12:20:20', // 活动时间
          firstStatus: -1, // 一审状态 1未审核 2已通过 -1未通过
          secondStatus: -1, // 二审状态 1未审核 2已通过 -1未通过
          createTime: '2019-08-05 12:20:20', // 创建时间
          publishPerson: '王玉龙' // 发布者
        }
      ],
      editdisabled: true, // 修改按钮禁用状态
      deldisabled: true, // 批量删除按钮禁用状态
      dialogData: {
        isShow: false, // 默认隐藏
        type: 'add', // 默认新增
        params: '' // 编辑时，传递的参数
      },
      statusList: [
        // 用户状态
        { key: '所有', value: 0 },
        { key: '正常', value: 1 },
        { key: '停用', value: -1 }
      ],
      multipleSelection: [] // 选中的行
    }
  },
  // mounted() {
  //   this.LoadRole();
  // },
  methods: {
    // 创建活动
    handleadd() {},
    // 提交
    handelsubmit() {},
    createHandle() {
      this.$router.push({ name: 'createActivities' })
    },
    // 编辑
    handeledit() {},
    // 删除
    handeldelete(id) {
      this.$confirm('确定删除该条信息吗?', '删除提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {})
        .catch(() => {})
    },
    /* 跳转页面 */
    changeView(name) {
      this.$router.push({ name: name })
    }
  }
}
</script>

<style lang="less">
.tag-success {
  background: #1dc8a4;
}
</style>
